import React, { useEffect, useRef, useState } from 'react';
import { Card, Modal, Button, Form, Image, message, Tag } from 'antd';
import { connect, useRequest } from "umi";
import { countryNo, userNum, turnover, coinType, province, approve } from '@/services/basic';
import InitForm from '@/components/InitForm';
import { doFetch } from '@/utils/doFetch';
import ProDescriptions from '@ant-design/pro-descriptions';


let defaultFields = {
    "postCode": {
        "value": null,
        "type": "input",
        "title": "邮政编码",
        "name": [
            "postCode"
        ],
        "required": true
    },
    "faxCountryId": {
        "value": null,
        "type": "select",
        "title": "国际区号",
        "name": [
            "faxCountryId"
        ],
        "required": true,
        "options": {
            "database": countryNo,
            "params": {}
        }
    },
    "faxAreaCode": {
        "value": null,
        "type": "input",
        "title": "区号",
        "name": [
            "faxAreaCode"
        ],
        "required": true
    },
    "faxNo": {
        "value": null,
        "type": "input",
        "title": "传真号码",
        "name": [
            "faxNo"
        ],
        "required": true
    },
    "companyBrand": {
        "value": null,
        "type": "input",
        "title": "公司商标",
        "name": [
            "companyBrand"
        ],
        "required": true
    },
    "isForeign": {
        "value": null,
        "type": "select",
        "title": "是否对外加工定制",
        "name": [
            "isForeign"
        ],
        "required": false,
        "options": [
            {
                "label": "是",
                "value": 1
            },
            {
                "label": "否",
                "value": 2
            }
        ]
    },
    "empNumType": {
        "value": null,
        "type": "select",
        "title": "员工人数",
        "name": [
            "empNumType"
        ],
        "required": false,
        "options": {
            "database": userNum,
            "params": {}
        }
    },
    "turnoverType": {
        "value": null,
        "type": "select",
        "title": "营业额",
        "name": [
            "turnoverType"
        ],
        "required": false,
        "options": {
            "database": turnover,
            "params": {}
        }
    },
    "currencyType": {
        "value": null,
        "type": "select",
        "title": "币种",
        "name": [
            "currencyType"
        ],
        "required": false,
        "options": {
            "database": coinType,
            "params": {}
        }
    },
    "factoryArea": {
        "value": null,
        "type": "inputnumber",
        "title": "厂房面积",
        "name": [
            "factoryArea"
        ],
        "required": false
    },
    "qualityControlSourceType": {
        "value": null,
        "type": "select",
        "title": "主要市场",
        "name": [
            "qualityControlSourceType"
        ],
        "required": false,
        "options": [
            {
                "label": "内部",
                "value": 1
            },
            {
                "label": "第三方",
                "value": 2
            },
            {
                "label": "无",
                "value": 3
            }
        ]
    },
    "marketIdList": {
        "value": null,
        "type": "select",
        "title": "主要市场",
        "name": [
            "marketIdList"
        ],
        "required": false,
        "multiple": true,
        "options": {
            "database": province,
            "params": {}
        }
    },
    "approveIdList": {
        "value": null,
        "type": "select",
        "title": "体系认证",
        "name": [
            "approveIdList"
        ],
        "required": false,
        "multiple": true,
        "options": {
            "database": approve,
            "params": {}
        },
        "col": {
            "span": 24
        }
    }
}



let Company = (props) => {
    const { global, dispatch } = props;

    const actionRef = useRef();
    const [vs, cvs] = useState(false),//表单显/隐
        [fields, cf] = useState(defaultFields),
        [iftype, ciftype] = useState({}),
        [formRef] = Form.useForm(),
        [data, cdata] = useState({});


    const { run, loading } = useRequest(doFetch, {
        manual: true,
        formatResult: (res) => res,
        onSuccess: (result, params) => {
            message.destroy()
            if (result.code == "0000") {
                cdata(result.data.data);
                cvs(false);
            } else {
                message.error(result.msg)
            }
        }
    })
    useEffect(() => {
        run({ url: "/ngic-promote-company/omCompanyBusinessInfoAudit/queryBeforeAddAudit", params: {} })
    }, [])

    const columns = [
        {
            "title": "邮政编码",
            "dataIndex": "postCode",
            "key": "postCode"
        },
        {
            "title": "国际区号",
            "dataIndex": "faxCountryCode",
            "key": "faxCountryCode"
        },
        {
            "title": "区号",
            "dataIndex": "faxAreaCode",
            "key": "faxAreaCode"
        },
        {
            "title": "传真号码",
            "dataIndex": "faxNo",
            "key": "faxNo"
        },
        {
            "title": "公司商标",
            "dataIndex": "companyBrand",
            "key": "companyBrand"
        },
        {
            "title": "对外加工定制",
            "dataIndex": "isForeignName",
            "key": "isForeignName"
        },
        {
            "title": "员工人数",
            "dataIndex": "empNumName",
            "key": "empNumName"
        },
        {
            "title": "营业额名",
            "dataIndex": "turnoverName",
            "key": "turnoverName"
        },
        {
            "title": "币种名",
            "dataIndex": "currencyName",
            "key": "currencyName"
        },
        {
            "title": "厂房面积",
            "dataIndex": "factoryArea",
            "key": "factoryArea"
        },
        {
            "title": "主要市场",
            "dataIndex": "qualityControlSourceName",
            "key": "qualityControlSourceName"
        },
        {
            "title": "审核结果",
            "dataIndex": "auditResult",
            "key": "auditResult"
        },
        {
            "title": "审核状态",
            "dataIndex": "statusName",
            "key": "statusName"
        },
        {
            "title": "主要市场",
            "dataIndex": "markList",
            "key": "markList",
            render: (text, row) => {
                return row.markList && row.markList.map((it) => {
                    return <Tag key={it.principalMarketId}>{it.principalMarketName}</Tag>
                })
            }
        },
        {
            "title": "体系认证",
            "dataIndex": "approveList",
            "key": "approveList",
            render: (text, row) => {
                return row.approveList && row.approveList.map((it) => {
                    return <Tag key={it.systemApproveId}>{it.systemApproveCode}</Tag>
                })
            }
        }
    ]

    let saveData = (values, fn) => {
        let newfields = JSON.parse(JSON.stringify(values));
        //新增&修改

        doFetch({ url: "/ngic-promote-company/omCompanyBusinessInfoAudit/save", params: { ...newfields } }).then(res => {
            if (res.code == "0000") {
                run({ url: "/ngic-promote-company/omCompanyBusinessInfoAudit/queryBeforeAddAudit", params: {} })
                message.success("操作成功！")
            }
        })
    }



    return (
        <div className="nopa autotable">
            <Card title={"业务信息"} extra={<a onClick={() => {
                ciftype({
                    val: "edit",
                    title: "编辑业务信息"
                })
                cf((fields) => {
                    for (let i in fields) {
                        fields[i].value = data[i];
                    }

                    return { ...fields }
                });
                cvs(true);
            }}>
                编辑
            </a>}>
                <div style={{ padding: "18px 12px 0px 12px" }} className="minw">
                    <ProDescriptions
                        title={``}
                        columns={[...columns]}
                        column={{ xs: 1, sm: 1, md: 1, lg: 1, xl: 1, xxl: 1 }}
                        dataSource={data || {}}
                    />
                </div>

            </Card>



            <Modal
                maskClosable={false}
                title={iftype.title}
                visible={vs}
                onCancel={() => cvs(false)}
                footer={false}
                destroyOnClose={true}
            >
                <InitForm
                    formRef={formRef}
                    fields={fields}
                    submitData={(values, fn) => {
                        saveData(values, fn)
                    }}
                    onChange={(changedValues, allValues) => {
                    }}
                    submitting={
                        loading || !vs
                    }
                >
                </InitForm>
            </Modal>
        </div>
    )
}

export default connect(({ global, loading }) => ({
    global,
    loading,
}))(Company)